<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>中心动态列表页面</title>
	</head>
	<style>
	*{
		margin: 0;
		padding: 0;
	}
		#main{
			width: 250px;
			 /*整体居中显示*/
			margin-left: 475px;
			border: 1px gray dotted;
			background: linear-gradient(#CCCCFF,#FFFFFF);
			/*设置圆角边框*/
			border-radius: 20px;
			box-sizing: border-box;
			padding: 0;
			
		}
		#title{
			background-image: url(../img/bg.gif);
			background-repeat: no-repeat;
			padding-left: 50px;
			color: white;
			border-bottom: 1px solid white; 
		}
		ul li{
			list-style-type: none;
			/*背景图片来设计小三角*/
			background-image: url(../img/dotBg.gif);
			background-position: -9px;
			border-bottom: 1px dotted gray;
			padding-left: 5px;
		
		}
		a{
			text-decoration: none;
			color: gray;
		}
		a:hover{
			text-decoration: none;
			color: red;
		}
	</style>
	<body>
		<div id="main">
		<div id="title">中心开班信息</div>
<ul>
	<li><a href="#">8月12日：学历+技能班</a></li>
	<li><a href="#">8月16日：高考特招班</a></li>
	<li><a href="#">8月23日：Java精英班</a></li>
	<li><a href="#">8月31日：学士后强化班</a></li>
	<li><a href="#">9月5日：大学生就业班</a></li>
	<li><a href="#">9月9日：企业定向委培班</a></li>
	<li><a href="#">9月16日：网络营销强化班</a></li>
</ul>
</div>
	</body>
</html>
